<script lang="ts" setup>
import DCRecommend from '@/components/DCRecommend.vue'
import type { DCRecommendInstance } from '@/types/component'
import { ref } from 'vue'
const searchRef = ref<DCRecommendInstance>()
const onScrollToLower = () => {
  console.log('滚动触底')
  searchRef.value?.getMore()
}
const isTrigger = ref(false)
const isLoading = ref(true)
const onRefresherRefresh = async () => {
  isTrigger.value = true
  isLoading.value = true
  searchRef.value?.resetData()
  await searchRef.value?.getMore()
  isTrigger.value = false
  isLoading.value = false
}
</script>
<template>
  <scroll-view
    scroll-y
    class="scroll-view"
    @scrolltolower="onScrollToLower"
    :refresher-enabled="true"
    @refresherrefresh="onRefresherRefresh"
    :refresher-triggered="isTrigger"
  >
    <DCRecommend title="菜品搜索页面" ref="searchRef" />
  </scroll-view>
</template>

<style scoped></style>
